@(questionForm: Form[models.data.Spurningar], multiChoiceForm: Form[models.data.Svor],courses: List[models.general.vKennariHoparOnn], annir: List[models.data.Annir])

@teacherMain(title = "Ný krossaspurning prototype 'yall"){


    <link rel="stylesheet" href="/public/stylesheets/bootstrapSwitch.css">
    <script src="/public/javascripts/bootstrapSwitch.js"></script>


    <div class="container">
        <div class="row">
            <div class="span12">

                <h2>Spurning</h2>

                @helper.form(action = routes.TeacherController.saveMultiChoice(0), 'class -> "form-horizontal") {
                    <fieldset>
                        <div id="legend" class="">
                            <legend class="">Búa til spurningu</legend>
                        </div>

                        <div class="control-group">
                            <label class="control-label">Tegund spurningar</label>
                            <div class="controls">
                                <select id = "tegund" name="tegund" class="selectpicker span6" onchange="run();">
                                    <option value="text"> Textaspurning </option>
                                    <option value="multipleChoice"> Krossaspurning </option>
                                </select>
                            </div>
                        </div>
                        <script>

                        </script>

                        <script>
                                function myFunction(val)
                                {
                                var element=document.getElementById('questionText');

                                if(val=='notext' || val=="")
                                element.style.visibility = "hidden";
                                else if(val='text')

                                element.style.visibility = "visible";
                                }
                        </script>

                            <!--Her eru allir afangar sem kennari kennir a thessari onn sottir ur gagnagrunni og settir i datalist -->
                        <datalist id="courses">
                            @for(course <- courses){
                                <option value="@{course.namsgrein_afanganr}">
                            }
                        </datalist>

                        <div class="control-group">
                            <label class="control-label">Áfangi</label>
                            <div class="controls">
                                <input name= "afangi_id" list="courses" class="input-large"/>
                            </div>
                        </div>

                        <div class="control-group">
                            <label class="control-label">Önn</label>
                            <div class="controls">
                                <select id = "onn_id" name="onn_id" class="selectpicker span6">
                                    @for(onn <- annir){
                                        <option value="@{onn.onn_id}">@{onn.onn_heiti}</option>
                                    }
                                </select>
                            </div>
                        </div>

                        <div class="control-group">
                            <label class="control-label">Þyngdarstig spurningar</label>
                            <div class="controls">
                                <select id = "weightOfQuestion" name="tyngdarstig" class="selectpicker span6">
                                    <option value="1">Létt</option>
                                    <option value="2">Miðlungs</option>
                                    <option value="3">Erfitt</option>
                                </select>
                            </div>
                        </div>


                        <datalist id="bookName">
                            <option value="Bok1">
                            <option value="Bok2">
                        </datalist>

                        <datalist id="authors">
                            <option value="author1">
                            <option value="author2">
                        </datalist>

                        <script>
                                $(document).ready(function(){

                                $(".bookInfo").hide();
                                $(".show_hide").show();

                                $('.show_hide').click(function(){
                                $(".bookInfo").slideToggle();
                                });

                                });
                        </script>

                        <div class="control-group">
                            <label class="control-label"></label>
                            <div class="controls">
                                <a href="#" class="show_hide">Upplýsingar um bók</a>
                            </div>
                        </div>

                        <div class="bookInfo">
                            <div class="control-group">
                                <label class="control-label">Nafn á bók</label>
                                <div class="controls">
                                    <input name="bok_id" list="bookName" class="input-large"/>
                                </div>
                            </div>

                            <div class="control-group">
                                <label class="control-label">Númer útgáfu</label>
                                <div class="controls">
                                    <input name="nr_utgafu" class="input-large"/>
                                </div>
                            </div>                                                          assoc

                            <div class="control-group">
                                <label class="control-label">Höfundur bókar</label>
                                <div class="controls">
                                    <input name="hofundur_bokar" list="authors" class="input-large"/>
                                </div>
                            </div>

                            <div class="control-group">
                                <label class="control-label">Númer kafla</label>
                                <div class="controls">
                                    <input name="kafli" class="input-large"/>
                                </div>
                            </div>
                        </div> <!--end of bookInfo -->


                        <div class="control-group">
                            <label class="control-label">Texti spurningar</label>
                            <div class="controls">
                                <input name= "texti" class="input-xxlarge" placeholder="Spurningin þín kemur hingað">


                            </div>
                        </div>

                        <div id="answers" class="control-group" >
                                <label class="control-label">Svarmöguleikar</label>
                                <div class="controls">
                                    <input name="svor_texti" class="input-xxlarge" placeholder="Svar eitt" style="margin-bottom:5px">

                                    <input type="hidden" name="rettsvar" value="false">
                                    <input type="checkbox" name="rettsvar" value="true">

                                    <input name="svor_texti" class="input-xxlarge" placeholder="Svar tvö" style="margin-bottom:5px">

                                    <input type="hidden" name="rettsvar" value="false">
                                    <input type="checkbox" name="rettsvar" value="true">

                                    <input name="svor_texti" class="input-xxlarge" placeholder="Svar þrjú" style="margin-bottom:5px">

                                    <input type="hidden" name="rettsvar" value="false">
                                    <input type="checkbox" name="rettsvar" value="true">

                                    <input name="svor_texti" class="input-xxlarge" placeholder="Svar fjögur" style="margin-bottom:5px">

                                    <input type="hidden" name="rettsvar" value="false">
                                    <input type="checkbox" name="rettsvar" value="true">

                                </div>
                        </div>

                        <div class="control-group">
                            <div class="form-actions">
                                <input type="submit" class="btn btn primary" value="Búa til spurningu">
                                <a href="@routes.TeacherController.teacherDashboard()" ><input type="button" class="btn" value="Hætta við" /></a>
                            </div>
                        </div>
                    </fieldset>

                } <!--end of helper -->

            </div> <!--end of span3 in the beginning -->
        </div> <!--div class row -->
    </div> <!-- /container -->


    <!-- select prettifier -->
    <link rel="stylesheet" href="/public/stylesheets/bootstrap-selects/bootstrap-select.css">
    <script src="/public/javascripts/bootstrap-selects/bootstrap-select.js"></script>
    <script type="text/javascript">
            window.onload=function(){
            $('.selectpicker').selectpicker();
            };
    </script>
}
